<template>
  <div id="box">
    <el-button type="button" @click="getData()">小熊点点它</el-button>
    <el-button @click="cleanContent()">清除返回结果</el-button>
    <p>{{ msg }}</p>
    <el-button @click="getWithParams()">带参数获取</el-button>
    <!-- <h1>site : {{data}}</h1> -->

    <hr>
    <content-show data="这里是文章测试标题，含标点一共二十个字。这里是文章测试标题，含标点一共二十个字。
    这里是文章测试标题，含标点一共二十个字。这里是文章测试标题，含标点一共二十个字。
    这里是文章测试标题，含标点一共二十个字。这里是文章测试标题，含标点一共二十个字。
    这里是文章测试标题，含标点一共二十个字。这里是文章测试标题，含标点一共二十个字。" maxLength="100"/>
  </div>
</template>

<script>
import ContentShow from "@/views/contentShow";

export default {
  name: "requestTest",
  components: {ContentShow},
  data() {
    return {
      msg: ''
    };
  },
  methods: {
    getData() {
      this.$store.dispatch("SendGetRequest", "getRequestData").then(res => {
        if (res.status) {
          let result = res.data;
          let code = result.code;
          if (code == 200) {
            let backMsg = result.data + ":" + result.message;
            console.log(backMsg);
            this.msg = backMsg
          } else {
            let backMsg = "请求返回接口结果错误" + result.message
            console.log();
            this.msg = backMsg
          }
        } else {
          alert("请求失败")
        }
      })
    },
    cleanContent() {
      this.msg = ''
    },
    // 携带参数
    getWithParams() {
      this.$axios.post("/getWithParams", {
        params: {
          name: 'jiao'
        }
      }).then(res => {
        console.log(res.data)
      })
      /*this.$axios({
        method: 'get',
        url: '/getWithParams',
        params: {
          name: 'jiao'
        }
      }).then((res) => {
        console.log(res.data)
      });*/
    }
  }
};

</script>

<style scoped>

</style>
